<template>
	<view class="mine-container">
		<view >
			<uni-list class="mine-actions grid ">
				<uni-list-item showExtraIcon="true" :extraIcon="{type: 'calendar'}" title="日期" :rightText="hourDate" />
				<uni-list-item showExtraIcon="true" :extraIcon="{type: 'medal'}" title="工时数" :rightText="useHourTotal + '小时'" />
					
			</uni-list>
		</view>
		<view class="help-container">
			<uni-forms ref="form" :model="form" labelWidth="80px">
				<view v-for="(item, index) in projectList" :key="item.projectId" class="list-title">
					<view class="childList">
						<uni-title type="h1" :title="item.projectName" color="#000000"></uni-title>
						<uni-forms-item label="类型">
							<uni-data-select v-model="item.workTypeId" :localdata="workTypeList"></uni-data-select>
						</uni-forms-item>

						<uni-forms-item label="工时">
							
							<uni-easyinput v-model.number="item.hour" placeholder="工时数" type="number"
								@input="lookinput(index,$event)" class="input" />
							<view style="margin:0 10px">单位：小时</view>
						</uni-forms-item>

						<uni-forms-item label="日志">
								<uni-easyinput v-model="item.daily"  autoHeight  placeholder="请输入工作内容" type="textarea"   class="input" />
						</uni-forms-item>
					</view>
				</view>
			</uni-forms>
		</view>

		<view class="chat-footer">
			<view class=""> 提示：{{ submitTips }}</view>
			<view class="send-btn" @click="handleSubmit">提交工时</view>
		</view>
	</view>

</template>

<script>
	import storage from '@/utils/storage';
	import {
		getMyHourDetailt,
		getWorkTypeSelect,
		updateHour,
	} from "@/api/mhour/project";
	import {
		getDailyDetail
	} from "@/api/dataStat/review";
	import {
		getAppConfig
	} from "@/api/manage/appConfig";

	export default {

		data() {
			return {
				hourId: '',
				submitTips: "",
				submitFlag: true,
				appSetting: {},


				workTypeList: [],
				workTypeHourList: [{
					hour: 0,
					workTypeId: 1
				}],
				projectArr: [],
				form: {
					date: "",
					projectHours: [],
				},
				maxlength: 2,


				//构建编辑页面
				workTypeSelect: [],
				configData: {},
				projectList: [],
				useHourTotal: 0,
				hourDate: "",

			}
		},
		mounted() {
			this.hourId = this.$route.query.hourId;
			this.open();

		},
		onLoad() {
			this.getWorkType();
			this.getHourSetting();



		},
		onShow() {

		},
		computed: {
			windowHeight() {
				return uni.getSystemInfoSync().windowHeight - 50
			},
		},
		methods: {
			open() {
				if (this.hourId == null) {
					this.$modal.msgError("没有填报信息，请重新选择")
					return;
				}
				getMyHourDetailt(this.hourId).then(res => {
					if (res.code == 200) {
						this.submitTips = "可以提交";
						if (res.data == []) {
							this.hourId = 0;
						} else {
							this.hourId = res.data[0].hourId;
						}
						this.projectList = res.data;
						this.hourDate = this.projectList[0].fillDate

						this.projectList.forEach(el => {
							console.log("el:", el)
							this.useHourTotal += el.useHour;
							if (!el.hasOwnProperty('workTypeHourList')) {
								// console.log("对worktypeid进行重新赋值")
								el.workTypeId = 1;
								el.useHour = 0;
							} else if (el.workTypeHourList == null) {
								//console.log("对worktypeid进行重新赋值")
								el.workTypeId = 1;
								el.useHour = 0;
							} else {
								el.workTypeId = el.workTypeHourList[0].workTypeId;
							}
							el.hour = el.useHour;
							delete el.useHour;

							//console.log("el:",el)

						});
						console.log("处理后的", this.projectList);

					}
					if (res.code == 500) return;
				});


			},


			handleSubmit() {
				if (this.submitFlag) {
					this.$modal.msgError("工时超出要求，请重新输入后提交")
					return
				}

				let data = {
					hourId: this.hourId,
					projectHours: [],

				};
				this.projectList.forEach(el => {
					// console.log(el);
					workTypeHourList: []
					let temp = {
						detailId: el.id,
						hour: el.hour,
						projectId: el.projectId,
						daily: el.daily,
						workTypeHourList: [{
							workTypeId: el.workTypeId,
							hour: el.hour
						}]
					};
					data.projectHours.push(temp);
				});
				if (!this.appSetting.overtimeAllow && this.useHourTotal > this.appSetting.workTime) {
					this.$modal.msgError("工时超出要求，请重新输入后提交")
					return
				}

				updateHour(data).then(res => {
					// console.log(res);
					if (res.code == 200) {
						this.$modal.loading("提交成功");
						var pages = getCurrentPages();
						var prevPage = pages[pages.length - 2];
						uni.navigateBack({
							success: (event) => {
								prevPage.$vm.reload();
							}
						})
					} else {
						this.$modal.msgError("提交失败，失败原因为：", res.msg)
					}

				});


			},

			getprojectArr(date) {
				getMyActorProject(date).then(res => {
					this.form.projectHours = [];
					if (res.code == 200) {
						this.projectArr = res.data;
						this.projectArr.forEach(el => el.hour = 0);
						this.projectArr.forEach(el => el.workTypeId = 1);
						this.projectArr.forEach(el => {
							this.form.projectHours.push(
								Object.assign({}, JSON.parse(JSON.stringify(el)))
							)
						});
					}
					//console.log("form",this.form.projectHours)
				});
			},
			getWorkType() {
				getWorkTypeSelect().then(res => {
					if (res.code == 200) {
						this.workTypeList = res.data
						if (this.workTypeList.length > 0) {
							this.workTypeList.forEach(el => {
								el.value = el.id;
								el.text = el.name;
							})
						}
					}
				});
			},



			lookinput(h, e) {
				if (!e) {
					this.sunmitflag = true;
					this.submitTips = "工时不能为空";
					return
				}
				//console.log(e)
				this.projectList[h].hour = e;
				let sum = 0;

				for (let item of this.projectList) {
					console.log("item:", item)
					console.log("item.hour:", item.hour)
					sum += parseFloat(item.hour);

					console.log("sum的值是", sum)
				}

				this.useHourTotal = sum;
				console.log(this.useHourTotal)
				console.log(sum)

				if (sum > 24) {
					this.submitFlag = true;
					this.submitTips = `工时最大范围为0-24小时!`;
				}

				if (this.appSetting.overtimeAllow) {
					this.submitTips = "可以提交!(可加班)";
					this.submitFlag = false;
				}
				if (this.appSetting.overtimeAllow && sum <= 24) {
					this.submitFlag = false;
					this.submitTips = "可以提交!（加班）";
				} else {
					if (sum > this.appSetting.workTime) {
						this.submitFlag = true;
						this.submitTips = `工时范围为0-${this.appSetting.workTime}小时!`;
					} else if (sum <= this.appSetting.workTime) {
						this.submitFlag = false;
						this.submitTips = "可以提交！";
					}
				}
				console.log("执行完lookinput")
			},


			getHourSetting() {
				getAppConfig().then(res => {
					//console.log("settings", res);
					if (res.code == 200) {
						this.appSetting = res.data;
					}
				});
			},

		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f8f8f8;
	}

	.help-container {
		margin-bottom: 100rpx;
		padding: 30rpx;
	}

	.list-title {
		margin-bottom: 30rpx;
	}

	.childList {
		background: #ffffff;
		box-shadow: 0px 0px 10rpx rgba(193, 193, 193, 0.2);
		border-radius: 16rpx;
		margin-top: 10rpx;
	}

	.line {
		width: 100%;
		height: 1rpx;
		background-color: #F5F5F5;
	}

	.text-title {
		color: #303133;
		font-size: 32rpx;
		font-weight: bold;
		margin-left: 10rpx;

		.iconfont {
			font-size: 16px;
			margin-right: 10rpx;
		}
	}

	.text-item {
		font-size: 28rpx;
		padding: 24rpx;
	}

	.question {
		color: #606266;
		font-size: 28rpx;
	}

	.chat-footer {
		width: 100%;
		padding: 0 20upx;
		height: 120upx;
		position: fixed;
		bottom: 0;
		left: 0;
		background-color: #f1f1f1;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		align-content: center;
		border-top: 1upx solid #ddd;

		.msg-input {
			background-color: #fff;
			width: 120upx;
			height: 70upx;
			line-height: 70upx;
			font-size: 30upx;
			border-radius: 10upx;
			text-align: center;

		}

		.img-chose {
			height: 70upx;
			width: 70upx;
		}

		.send-btn {
			height: 60upx;
			line-height: 60upx;
			width: 120upx;
			text-align: center;
			background-color: green;
			color: #FFFFFF;
			border-radius: 12upx;
		}

	}
	
	.mine-actions {
		margin: 15px 15px;
		padding: 20px 0px;
		border-radius: 8px;
		background-color: white;
	
		.action-item {
			.icon {
				font-size: 28px;
			}
	
			.text {
				display: block;
				font-size: 13px;
				margin: 8px 0px;
			}
		}
	}
</style>